 .erg-row {  display: flex;  align-items: center;  width: 100%;  min-height: 2.5rem;  }  .erg-row__content {  flex: 1;  }  .tabs__btn {  margin-right: 1rem;  }  .tabs__list {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(2em, 1fr));  gap: 1rem;  }  .erg-row__action {  display: flex;  justify-content: flex-end;  align-items: center;  }  [role="tablist"] {  min-width: 100%;  font-size: 2rem;  border-top: 1px solid;  }  [role="tab"],  [role="tab"]:focus,  [role="tab"]:hover {  display: inline-block;  padding: 3px 3px 4px;  font-weight: bold;  cursor: pointer;  }  [role="tab"][aria-selected="true"] {  background-color: var(--blue-800);  color: white;  }  [role="tab"][aria-selected="false"] {}  [role="tab"] span.focus {  display: inline-block;  margin: 2px;  padding: 4px 6px;  }  [role="tab"]:hover span.focus,  [role="tab"]:focus span.focus,  [role="tab"]:active span.focus {  padding: 2px 4px;  border: 2px solid rgb(36 116 214);  border-radius: 3px;  }  .erg__block .erg-row:nth-child(2n) {  background-color: var(--blue-100);  }  [role="tabpanel"] {  border: 2px solid hsl(219deg 1% 72%);  border-radius: 0 5px 5px;  background: hsl(220deg 43% 99%); width: 100%;  overflow: auto;  }  [role="tabpanel"].is-hidden {  display: none;  }  [role="tabpanel"] p {  margin: 0;  }  .tabs__btn--disabled {  color: #999;  cursor: not-allowed;  }  .tabs__btn--disabled:hover {  background: #f3f3f3;  } .l-result__filter-btn {  grid-column: 1/3; } .l-result__filter-container {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(33rem, 1fr));  gap: 1rem 1rem; } .l-result__results {  display: flex;  flex-flow: column;  gap: 0; } .info-block {  display: grid;  grid-template-columns: 1fr 1fr; } .info-block__offer-info {  justify-self: end;  grid-row: 1/3; } .l-result__filter-txt {  grid-row: 2; } @media (max-width: 999.8px) {  .info-block { grid-template-columns: 1fr;  }  .info-block__offer-info { justify-self: start;  }  .info-block__offer-info,  .l-result__filter-txt { grid-row: unset;  } }  .l-result__chips {  grid-column: 1/3;  grid-row: 4; } .erg__head {  margin: 1em 0; } .erg__block {  box-shadow: var(--box-shadow-z3); } .erg__link {  color: hsl(0, 0%, 0%);  text-decoration: none;  display: grid;  display: flex;  align-items: center;  justify-content: space-between;  grid-auto-flow: column;  gap: 0.3em;  overflow-wrap: anywhere; } .erg__link.l-erg__link {  gap: 1em; } .erg__link:hover {  text-decoration: underline;  color: var(--main-color); } .erg__link-img {  height: 1em; } .erg__li:nth-child(even) {  background-color: var(--blue-50); } .erg__list {  display: flex;  flex-direction: column; } .erg__li {  width: 100%;  padding: 0.5em 1em;  display: flex;  justify-content: space-between;  font-size: var(--fs-s); } .erg__icon-container {  display: flex;  position: relative;  align-items: center;  gap: 3px;  --tt-btn-size: 1.2em;  --icon-gap: 1rem; } .erg__icon-container>* {  display: flex;  align-items: center;  height: var(--tt-btn-size);  min-width: max-content; } .erg__icon-container>* {  padding-left: var(--icon-gap); } .erg__icon-container>*:first-child {  margin-right: var(--icon-gap); } .erg__icon-container>*:last-child {  margin-right: 0; } .angebot-icon {  display: flex;  align-items: center;  justify-content: end; } .angebot-icon__img {  height: 30px; } .angebot-btn {  border-left: 1px solid var(--grey-400);  padding-top: 5px;  padding-bottom: 5px;  height: max-content; } .tooltip {  position: relative; } .tooltip__btn {  height: var(--tt-btn-size);  width: var(--tt-btn-size); } .tooltip__txt {  position: absolute;  right: 0;  bottom: 100%;  margin-bottom: 3px;  border: 2px solid var(--tt-color);  background-color: var(--tt-color-secundary);  color: black;  border-radius: 7px;  padding: 2px;  font-size: var(--fs-xs);  max-width: min(30rem, 50vw);  width: max-content; } @media (max-width: 799.8px) {  .tooltip__txt {   left: unset;   right: 0;  }  .erg__link-txt {   font-size: var(--fs-xs);   overflow-wrap: anywhere;  }  .l-tooltip {   gap: 0;  } } .angebote-info {   display: grid;   grid-template-columns: auto auto 1fr;   row-gap: 1.5rem;   column-gap: 0.7rem;   align-items: center;   max-width: max-content;   border: 2px solid var(--main-color);   border-radius: 1.5rem;   padding: 1rem;   margin-bottom: 3rem; } .angebote-info__img {   grid-column: 1/3;   align-self: start; } .angebote-info strong {   font-size: 2.6rem;   margin: 0; } .angebote-info p {   font-size: 2.4rem;   margin: 0; } .offers__dialog[open] {   font-size: 1rem; } .offers__dialog {   --btn-head-w: 3.5rem;   --space-left: 2rem; } .offers__inner {   display: grid;   grid-template-columns: 1fr 4rem; } .offers__scroll-container {   grid-row: 3;   grid-column: 1/3;   padding-right: var(--pd-lr2); } .offers__close-btn {   grid-row: 1;   grid-column: 2;   width: 3.5rem;   font-weight: 500;   padding: 0; } .offers__close-btn::before {   content: 'X'; } .offers__dialog .btn--print {   display: block; } .offers__head {   grid-row: 2;   grid-column: 1;   display: grid;   grid-template-columns: 1fr 4rem;   margin-right: var(--space-left);   position: relative; } .offers__head button {   min-width: var(--btn-head-w); }  .offers__section:last-child {   border-bottom: 0; } .offers__section-h>span {   padding: 3px; } .details__title.offers__section-h {   font-size: 2.4em; } .c-dialog .offers__heading {   text-align: left;   flex-grow: 1;   font-size: 2.8em; } .c-dialog.offers__dialog * {   text-align: left; } .c-dialog.offers__dialog {   width: min(90vw, 110rem);   overflow-y: hidden;   --pd-lr: clamp(1rem, 10vi + -7rem, 5rem);   --pd-lr2: calc(var(--pd-lr) / 2);   padding: 1rem var(--pd-lr2) 2rem var(--pd-lr); } .c-dialog.offers__dialog .angebot__date {   font-size: 1.6em;   grid-row: 4;   grid-column: 1; } .offers__form {   display: grid;   row-gap: 1rem;   margin-top: 3rem;   max-width: 80rem;   position: relative;   --frm-bdr: 2rem;   --error-msg-h: 2.4rem;   --half-error-msg-h: calc(var(--error-msg-h) / 2); } .offers__form-input-cmb {   grid-column: 1;   grid-row: 1/3;   grid-template-rows: subgrid; } .offers__form-submit {   grid-row: 1;   grid-column: 2;   height: 100%;   width: max-content;   justify-self: left;   margin-left: 1rem;   font-size: 2.4em; } .offers__form-chk-container {   display: flex;   justify-content: left;   padding-left: var(--space-left);   grid-row: 3;   grid-column: 1;   row-gap: 5px; } .offers__list {   list-style: none;   background-color: var(--blue-50);   box-shadow: var(--box-shadow-z2);   --offers-list-pd:12px; } .offers__li {   padding: var(--offers-list-pd) 0 var(--offers-list-pd) var(--space-left); } .offers__li:nth-child(2n) {   background-color: white; } .angebot {   display: grid;   grid-template-columns: 1fr var(--img-angebot-w);   text-decoration: none;   color: black;   --img-angebot-w: 22rem;   --img-angebot-h: 10rem; } .angebot__inner {   grid-column: 1;   display: flex;   flex-direction: column;   justify-content: space-between; } .angebot__inner>* {   text-decoration: none; } .angebot__heading {   font-size: 2.4em;   grid-row: 1;   grid-column: 1; } .angebot__name {   color: var(--grey-500);   font-size: 2em;   grid-row: 2;   grid-column: 1; } .angebot__gesponsert {   grid-row: 1;   grid-column: 2;   justify-self: end;   padding: 5px;   font-size: 1.4em;   font-weight: 600;   position: relative;   bottom: var(--offers-list-pd);   background: var(--main-color);   color: white;   border-bottom-left-radius: 1rem;   height: max-content; } .angebot__info-container {   display: flex;   flex-wrap: wrap;   gap: 0.5rem;   grid-row: 3;   grid-column: 1; } .angebot__info {   --icon-url: url('../img/ausbildung.svg');   display: flex;   align-items: center;   font-size: 1.6em;   gap: 5px; } .angebot__info--ort {   --icon-url: url('../img/ort.svg') } .angebot__info--ausbildung, .angebot__info--weiterbildung, .angebot__info--studium {   --icon-url: url('../img/ausbildung.svg') } .angebot__info--job {   --icon-url: url('../img/job.svg') } .angebot__info::before {   content: var(--icon-url);   position: relative;   top: 2px; } .angebot__img-wrapper {   grid-row: 1 / 5;   grid-column: 2;   align-self: center; } .angebot__img {   max-width: var(--img-angebot-w);   max-height: var(--img-angebot-h);   padding-right: 1rem; }  .input-cmb {   display: grid;   grid-template-columns: 1fr max-content;   --i-cmb-pd: 10px;   --i-cmb-bdr: var(--frm-bdr);   --i-cmb-bd: 2px solid var(--grey-600);   font-size: 1.6em;   position: relative; } .input-cmb__input {   grid-column: 1;   grid-row: 1;   padding: var(--i-cmb-pd);   margin: 0;   border: var(--i-cmb-bd);   border-radius: var(--i-cmb-bdr) 0 0 var(--i-cmb-bdr); } .input-cmb__input.input-cmb__input--bg-ort {   --bg-w: 1.4em;   --bg-pd-r: 5px;   background: url('../img/ort.svg') no-repeat var(--i-cmb-pd) center / var(--bg-w) var(--bg-w);   padding-left: calc(var(--i-cmb-pd) + var(--bg-w) + var(--bg-pd-r));  } .input-cmb__cmb>.cmb__btn {   border-radius: 0 var(--i-cmb-bdr) var(--i-cmb-bdr) 0; } .input-cmb__input:focus-visible {   outline: none; } .input-cmb__cmb {   grid-row: 1;   grid-column: 2;   width: 6.5em; } .offers__form-input-cmb.error>.input-cmb__input, .offers__form-input-cmb.error>.input-cmb__cmb {   grid-row: 1; } .offers__form-input-cmb:not(.error)~.offers__form-chk-container {   padding-top: var(--half-error-msg-h);   padding-bottom: var(--half-error-msg-h); } .input-cmb__error {   display: none; } .input-cmb__error {   height: var(--error-msg-h);   font-size: var(--fs-s); } .offers__form-input-cmb.error .input-cmb__error {   display: block;   grid-row: 3;   grid-column: 1 / 3;   color: var(--c-error);   padding-left: var(--space-left); } .offers__form-input-cmb.error~.offers__form-submit {   grid-row: 1; } .input_cmb__autocomplete {   grid-row: 2;   grid-column: 1;   width: max-content;   overflow-y: scroll; } .input_cmb__autocomplete>ul {   border: none; } .input_cmb__autocomplete:not(:has(ul>li)) {   overflow-y: hidden; } .input_cmb__autocomplete>ul>li {   max-height: calc(10 * 2.5rem);   height: 2.5rem; } .input-cmb__cmb>.cmb__btn {   background: var(--main-color);   color: hsl(0, 0%, 100%);   padding: var(--i-cmb-pd) var(--i-cmb-pd) var(--i-cmb-pd) 5px;   height: 100%;   border-top-left-radius: 0;   border-bottom-left-radius: 0;   border: 0; } .input-cmb__cmb .cmb__options-container {   width: max-content; } .input-cmb__cmb .cmb__options-lbl {   display: block;  margin: 0;   padding: 1em 1em 0 1em; } .chk__container {   display: grid;   grid-template-columns: var(--chk-size) 1fr max-content var(--chk-size);   align-items: baseline;   --chk-size: 1.25em;   --chk-border-width: 0.2rem;   --chk-color: var(--main-color);   gap: 0.5rem;   grid-column: 2/4; } .chk {   width: var(--chk-size);   height: var(--chk-size);   aspect-ratio: 1/1;   border: var(--chk-border-width) solid var(--chk-color);   border-radius: 0.15em;   transform: translateY(-0.075em);   display: grid;   place-content: center; } .chk::before {   content: "✓";   transform: scale(0);   transition: 120ms transform ease-in-out; } .chk:checked {   background-color: var(--main-color);   color: white; } .chk:checked::before {   transform: scale(1);   content: "✓";   align-self: baseline;   justify-self: center;   text-align: center;   display: flex; } .chk:disabled {   color: var(--col-disabled); } .chk:disabled~.chk__label {   color: var(--col-disabled); } .chk:disabled~.chk__item-count {   color: var(--col-disabled); } .chk__label {   display: inline-flex;   align-items: baseline;   gap: 4px;   justify-content: space-between; } .offers__dialog {   border: 0; } .offers__section-container {   display: flex;   flex-direction: column;   gap: var(--gap);   --gap: clamp(1rem, 7.86vi + -1.59rem, 3.9rem); } .offers__section-container .offers__sort {   font-size: var(--fs-s);   font-weight: 600;   text-align: right;   margin-bottom: calc(var(--gap) * -0.6); } .offers__sort_btn.selected {   text-decoration: underline;   color: var(--main-color); } .bkm {   display: flex;   position: relative;   align-self: start;   --bkm-bdr: 10px;   --bkm-pd: 5px; } .bkm__txt {   display: none; } .bkm__btn {   filter: brightness(100%);   align-items: center; padding: var(--bkm-pd);   border-top-right-radius: var(--bkm-bdr);   border-bottom-right-radius: var(--bkm-bdr); } .bkm.open > .bkm__btn {   background: var(--main-color); } .bkm.open .btn--print-icon {   filter: invert(1); } .bkm.open > .bkm__txt {   position: absolute;   right: var(--btn-head-w);   text-align: right;   width: max-content;   padding: 0 var(--bkm-pd);   height: 100%;   display: inline-flex;   align-items: center;   background: var(--main-color);   color: white;   font-size: var(--fs-xs);   border-top-left-radius: var(--bkm-bdr);   border-bottom-left-radius: var(--bkm-bdr); } @media (max-width: 699.8px) {   .c-dialog.offers__dialog {  width: 100vw;  max-width: 100vw;  transform: none;  left: 0;  top: 0;  border-top-left-radius: 0;  border-top-right-radius: 0;   }   .c-dialog.offers__dialog * {  overflow-wrap: break-word;  word-break: break-word;   }   .offers__form {  max-width: 50rem;  width: calc(100vw - (2 * var(--pd-lr)));   }   .offers__form-chk-container {  flex-wrap: wrap;   }   .offers__form-input-cmb.error~.offers__form-submit {  grid-row: 4;   }   .offers__form-submit {  grid-row: 4;  grid-column: 1;  padding: 1rem;  border-radius: var(--frm-bdr)   }   .details__title--arrow-left {  display: inline-flex;  flex-wrap: wrap;   }   .input-cmb__input {  min-width: 0;   }   .input-cmb__input::placeholder{  font-size: 1.4rem;   }   .offers__close-btn {  grid-column: 1;  aspect-ratio: unset;  width: max-content;  background: white;  color: black;  font-weight: 400;  border-radius: 5px;   }   .offers__dialog[open] {  background: white;  color: black;  font-weight: 400;  border-radius: 0;  height: max-content;  aspect-ratio: unset;   }   .offers__close-btn::before {  content: '←';  transition: all 0.2s ease-in;   }   .offers__close-btn:hover {  right: 3px;  font-weight: 500;  background-color: white;  color: black;   }   .offers__li{  padding-top: 0;   }   .angebot {  grid-template-columns: var(--img-angebot-w) 1fr;  gap: 8px;   }   .angebot__img-wrapper {  border: 2px solid var(--grey-300);  border-radius: 2rem;  display: flex;  align-items: center;  aspect-ratio: 3/2;  max-width: 18rem;  grid-row: 4;  grid-column: 1;   }  .angebot__img {  padding: 1rem;   }   .angebot__gesponsert{  grid-row: 1;  bottom: 0;   }   .angebot__heading {  grid-column: 1/3;  grid-row: 2;   }   .angebot__name {  grid-column: 1/3;  grid-row: 3;   }   .angebot__info-container {  grid-column: 2;  grid-row: 4;  flex-direction: column;  justify-content: space-evenly;   }   .c-dialog.offers__dialog .angebot__date {  grid-column: 1/3;  grid-row: 5;   }   .offers__section-container .offers__sort {  text-align: center;   }   .c-dialog__scroll-container {  width: 100vw;  left: calc(var(--pd-lr) * -1);  position: relative;  padding-left: var(--pd-lr);  overflow-x: hidden;   }   .offers__form::before,   .offers__sort::before,   .offers__head::before {  position: absolute;  content: '';  background-color: var(--blue-100);  height: 100%;  width: 150vw;  left: -3rem;  bottom: 0;   }   .offers__form > *, .offers__sort > *, .offers__head > * {   position: relative;   }   .offers__form {  padding: 3rem 0;  margin: 0;   }   .offers__sort {  padding: 1rem;  position: relative;   }   .offers__sort::before {  box-shadow: 0 2px 2px 0 hsla(0, 0%, 0%, 0.2), 0 6px 10px 0 hsla(0, 0%, 0%, 0.3);  border-top: 1px solid var(--grey-500);   }   .offers__section-container {  margin: 0;  font-size: 0.9rem;   } } 